body { background-color: white; }

.banner img { width: 100%; }

.connet .cn-top { width: 996px; margin: 0 auto; }

.connet .cn-top .path { line-height: 60px; }

.connet .cn-top .cn-head { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; position: relative; }

.connet .cn-top .cn-head::after { content: ""; display: block; width: 100%; height: 1px; background-color: #b4b4b4; position: absolute; bottom: 0%; left: 0; }

.connet .cn-top .cn-head .cnh-lf .lf-top { width: 410px; height: 260px; display: -webkit-box; display: -ms-flexbox; display: flex; }

.connet .cn-top .cn-head .cnh-lf .lf-top div:first-of-type img { width: 100%; height: 100%; }

.connet .cn-top .cn-head .cnh-lf .lf-top div:last-of-type { position: relative; }

.connet .cn-top .cn-head .cnh-lf .lf-top div:last-of-type img { position: absolute; bottom: 5%; right: 20px; }

.connet .cn-top .cn-head .cnh-lf .lf-bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.connet .cn-top .cn-head .cnh-lf .lf-bottom div { width: 80px; height: 75px; border: 1px solid #b4b4b4; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.connet .cn-top .cn-head .cnh-lf .lf-bottom div img { width: 100%; }

.connet .cn-top .cn-head .cnh-rg { padding: 40px 10px 0px 40px; }

.connet .cn-top .cn-head .cnh-rg div:first-child h1 { line-height: 40px; font-size: 20px; color: #468bd9; }

.connet .cn-top .cn-head .cnh-rg div:first-child h2 { line-height: 40px; font-size: 20px; }

.connet .cn-top .cn-head .cnh-rg div:first-child p { font-size: 10px; }

.connet .cn-top .cn-head .cnh-rg div:first-child p:first-of-type { font-size: 14px; font-weight: bold; line-height: 30px; }

.connet .cn-top .cn-head .cnh-rg .rg-bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; margin-top: 30px; }

.connet .cn-top .cn-head .cnh-rg .rg-bottom div { width: 150px; height: 40px; color: white; line-height: 40px; border-radius: 10px; text-align: center; background-color: #b5b5b5; cursor: pointer; }

.connet .cn-top .cn-head .cnh-rg .rg-bottom div:hover { background-color: #468bd9; }

.connet .cn-center { background-color: #b5b5b5; height: 85px; }

.connet .cn-center .cn-nav { width: 996px; margin: 35px auto; display: -webkit-box; display: -ms-flexbox; display: flex; }

.connet .cn-center .cn-nav div { text-align: center; line-height: 85px; color: white; font-size: 20px; margin-left: 25px; position: relative; }

.connet .cn-center .cn-nav div:hover { background-color: white; color: #468bd9; }

.connet .cn-center .cn-nav div:hover::after { content: ""; display: block; width: 100%; height: 4px; background-color: #468bd9; position: absolute; bottom: 0%; left: 0; }

.connet .cn-bottom { width: 996px; margin: 0 auto; text-align: center; margin-top: 60px; }

.connet .cn-bottom h1 { font-size: 30px; color: #0b5ae4; line-height: 50px; }

.connet .cn-bottom p { font-size: 10px; color: #b6b6b6; line-height: 25px; }

.connet .cn-bottom img { margin: 40px 0; width: 747px; }

.connet .bt-center { background-color: #b5b5b5; height: 85px; }

.connet .bt-center .bt-nav { width: 996px; margin: 35px auto; display: -webkit-box; display: -ms-flexbox; display: flex; }

.connet .bt-center .bt-nav div { text-align: center; line-height: 85px; color: white; font-size: 20px; margin-left: 25px; }

.connet .bt-product { width: 996px; margin: 60px auto; display: -webkit-box; display: -ms-flexbox; display: flex; }

.connet .bt-product img { width: 200px; }
